<div class="panel panel-default">

	<div class="panel-body">
		

<!-- Nested node template -->
<style>
	.pre-scrollable {
		max-height: 700px;
		overflow-y: scroll;
	}
</style>
	<style type="text/css">
		* {
			margin: 0;
			padding: 0;
			border: 0;
		}

		body {
			font-family: "Segoe UI", "Lucida Grande", Helvetica, Arial, "Microsoft YaHei", FreeSans, Arimo, "Droid Sans", "wenquanyi micro hei", "Hiragino Sans GB", "Hiragino Sans GB W3", Arial, sans-serif;
		}

		.tree-node {
			padding: 5px;
			/*padding-top:5px;
			padding-bottom:5px;*/
			font-family: "黑体";
		}

		.panel-body {
			padding-left: 5px;
		}


		.mt10 {
			margin-top: 10px;
		}

		.mt15 {
			margin-top: 15px;
		}

		.mt20 {
			margin-top: 20px;
		}

		.mt25 {
			margin-top: 25px;
		}

		.mb10 {
			margin-bottom: 10px;
		}

		.mb20 {
			margin-bottom: 20px;
		}

		.ml20 {
			margin-left: 20px;
		}

		.mr15 {
			margin-right: 15px;
		}

		.fl {
			float: left;
		}

		body {
			/*padding-bottom: 70px;*/
		}

		.navbar-brand {
			/*padding-top: 5px;*/
		}


		.pt5 {
			padding-top: 5px;
		}


		.modal-lg {
			width: 1200px;
		}

		.angular-ui-tree-handle {
			background: #f8faff;
			border: 1px solid #dae2ea;
			color: #7c9eb2;
			padding: 10px 10px;
		}

		.angular-ui-tree-handle:hover {
			color: #438eb9;
			background: #f4f6f7;
			border-color: #dce2e8;
		}

		.angular-ui-tree-placeholder {
			background: #f0f9ff;
			border: 2px dashed #bed2db;
			-webkit-box-sizing: border-box;
			-moz-box-sizing: border-box;
			box-sizing: border-box;
		}

		tr.angular-ui-tree-empty {
			height: 100px
		}

		.group-title {
			background-color: #687074 !important;
			color: #FFF !important;
		}
		/* --- Tree --- */

		.tree-node {
			border: 1px solid #dae2ea;
			background: #f8faff;
			color: #7c9eb2;
		}

		.nodrop {
			background-color: #f2dede;
		}

		.tree-node-content {
			margin: 10px;
		}

		.tree-handle {
			padding: 10px;
			background: #428bca;
			color: #FFF;
			margin-right: 10px;
		}

		.angular-ui-tree-handle:hover {}

		.angular-ui-tree-placeholder {
			background: #f0f9ff;
			border: 2px dashed #bed2db;
			-webkit-box-sizing: border-box;
			-moz-box-sizing: border-box;
			box-sizing: border-box;
		}

		.navbar-custom {
			background-color: #428bca;
			border-color: #337ab7;
			border-radius: 0px;
		}

		.navbar-custom .navbar-brand {
			color: #ffffff;
		}

		.navbar-custom .navbar-brand:hover,
		.navbar-custom .navbar-brand:focus {
			color: #e6e6e6;
			background-color: transparent;
		}

		.navbar-custom .navbar-text {
			color: #ffffff;
		}

		.navbar-custom .navbar-nav>li>a {
			color: #ffffff;
		}

		.navbar-custom .navbar-nav>li>a:hover,
		.navbar-custom .navbar-nav>li>a:focus {
			color: #c0c0c0;
			background-color: transparent;
		}

		.navbar-custom .navbar-nav>.active>a,
		.navbar-custom .navbar-nav>.active>a:hover,
		.navbar-custom .navbar-nav>.active>a:focus {
			color: #c0c0c0;
			background-color: #337ab7;
		}

		.navbar-custom .navbar-nav>.disabled>a,
		.navbar-custom .navbar-nav>.disabled>a:hover,
		.navbar-custom .navbar-nav>.disabled>a:focus {
			color: #cccccc;
			background-color: transparent;
		}

		.navbar-custom .navbar-toggle {
			border-color: #dddddd;
		}

		.navbar-custom .navbar-toggle:hover,
		.navbar-custom .navbar-toggle:focus {
			background-color: #dddddd;
		}

		.navbar-custom .navbar-toggle .icon-bar {
			background-color: #cccccc;
		}

		.navbar-custom .navbar-collapse,
		.navbar-custom .navbar-form {
			border-color: #3379b5;
		}

		.navbar-custom .navbar-nav>.dropdown>a:hover .caret,
		.navbar-custom .navbar-nav>.dropdown>a:focus .caret {
			border-top-color: #c0c0c0;
			border-bottom-color: #c0c0c0;
		}

		.navbar-custom .navbar-nav>.open>a,
		.navbar-custom .navbar-nav>.open>a:hover,
		.navbar-custom .navbar-nav>.open>a:focus {
			background-color: #337ab7;
			color: #c0c0c0;
		}

		.navbar-custom .navbar-nav>.open>a .caret,
		.navbar-custom .navbar-nav>.open>a:hover .caret,
		.navbar-custom .navbar-nav>.open>a:focus .caret {
			border-top-color: #c0c0c0;
			border-bottom-color: #c0c0c0;
		}

		.navbar-custom .navbar-nav>.dropdown>a .caret {
			border-top-color: #ffffff;
			border-bottom-color: #ffffff;
		}

		@media (max-width: 767) {
			.navbar-custom .navbar-nav .open .dropdown-menu>li>a {
				color: #ffffff;
			}
			.navbar-custom .navbar-nav .open .dropdown-menu>li>a:hover,
			.navbar-custom .navbar-nav .open .dropdown-menu>li>a:focus {
				color: #c0c0c0;
				background-color: transparent;
			}
			.navbar-custom .navbar-nav .open .dropdown-menu>.active>a,
			.navbar-custom .navbar-nav .open .dropdown-menu>.active>a:hover,
			.navbar-custom .navbar-nav .open .dropdown-menu>.active>a:focus {
				color: #c0c0c0;
				background-color: #337ab7;
			}
			.navbar-custom .navbar-nav .open .dropdown-menu>.disabled>a,
			.navbar-custom .navbar-nav .open .dropdown-menu>.disabled>a:hover,
			.navbar-custom .navbar-nav .open .dropdown-menu>.disabled>a:focus {
				color: #cccccc;
				background-color: transparent;
			}
		}

		.navbar-custom .navbar-link {
			color: #ffffff;
		}

		.navbar-custom .navbar-link:hover {
			color: #c0c0c0;
		}
		/* 产品销售 */

		.num .jian,
		.num .jia,
		.num .kuang {
			width: 40px;
			height: 40px;
			float: left;
			font-size: 16px;
			text-align: center;
		}

		.num .kuang {
			width: 70px;
			border: none;
			border-top: 1px solid #ccc;
			border-bottom: 1px solid #ccc;
		}

		.num .jian,
		.num .jia {
			border: 1px solid #ccc;
			cursor: pointer;
		}

		.num .jian {
			border-top-left-radius: 4px;
			border-bottom-left-radius: 4px;
			border-top-right-radius: 0px;
			border-bottom-right-radius: 0px;
		}

		.num .jia {
			border-top-right-radius: 4px;
			border-bottom-right-radius: 4px;
			border-top-left-radius: 0px;
			border-bottom-left-radius: 0px;
		}
		/* 产品销售－补贴产品 */

		.unavailable,
		.unavailable:hover {
			cursor: not-allowed;
			color: #aaaaaa;
		}

		.tree-node-content:hover,
		.selected {
			color: #3c763d;
			background: #dff0d8;
		}
		/*卡池样式*/

		.wid20 {
			width: 20% !important;
		}

		.mb0 {
			margin-bottom: 0 !important;
		}

		.ss-item {
			position: relative;
			display: inline-block;
			height: 22px;
			line-height: 22px;
			border: 1px solid #DDD;
			font-size: 12px;
			vertical-align: top;
			margin: 0 5px 5px 0;
			padding: 0 4px 0 4px;
			cursor: pointer;
		}
	</style>
<script type="text/ng-template" id="nodes_renderer.html">
	<div ui-tree-handle class="tree-node tree-node-content" ng-click="getit(this)">
		<a class="btn btn-success btn-xs" ng-if="node.nodes && node.nodes.length > 0" data-nodrag ng-click="toggle(this)">
			<span class="glyphicon" ng-class="{
          'glyphicon-chevron-right': collapsed,
          'glyphicon-chevron-down': !collapsed
        }"></span></a>
		{{node.name}} （{{node.code}}）
		
	</div>
	<ol ui-tree-nodes="" ng-model="node.nodes" ng-class="{hidden: collapsed}" style="font-family: '黑体';">
		<li ng-repeat="node in node.nodes" data-collapsed="true" ui-tree-node ng-include="'nodes_renderer.html'" style="margin-left:20px;list-style-type:none;">
		</li>
	</ol>
</script>

<div class="row">
	<div class="col-sm-4">
		<div class="col-sm-12">
			<label class="control-label" ng-click="createstb()">
				已选菜单：&nbsp;&nbsp;&nbsp;&nbsp;
			</label>
			<button type="button" class="btn btn-info" ng-if="selectedCompany">
				{{selectedCompany}}
			</button>
		</div>
		<div class="col-sm-12 pre-scrollable">
			<div ui-tree id="tree-root" data-nodrop-enabled="true" data-drag-enabled="false" data-nodrag="false">
				<ol ui-tree-nodes ng-model="data">
					<li ng-repeat="node in data" ui-tree-node ng-include="'nodes_renderer.html'" style="list-style-type:none;"></li>
				</ol>
			</div>
		</div>
	</div>

	<div class="col-sm-8">
		<div class="panel panel-default">
			<div class="panel-body">
				<div class="form-group">
					<div class="col-xs-12">
						<div class="row">
						<div class="col-xs-3" >
							<input type="text" class="form-control" datepicker-popup="yyyy-MM-dd" ng-model="section.start.date.label" is-open="section.start.date.opened"
							 ng-click="open($event, section.start.date)" placeholder="开始时间" ng-required="true" close-text="Close" readonly/>
						</div>
						<div class="col-xs-3 ">
							<input type="text" class="form-control" datepicker-popup="yyyy-MM-dd" ng-model="section.end.date.label" is-open="section.end.date.opened"
							 ng-click="open($event, section.end.date)" placeholder="结束时间" ng-required="true" close-text="Close" readonly/>
						</div>
						<div class="col-xs-3 ">
							<input type="text" class="form-control" ng-keyup="myKeyup($event)" ng-model="searchform.product_name" placeholder="产品名称">
						</div>
						<div class="col-xs-3 ">
							 <ui-select ng-model="searchform.company_type" theme="bootstrap" ng-keyup="myKeyup($event)">
                                <ui-select-match placeholder="统计类型">
                                  {{$select.selected.label}}
                                </ui-select-match>
                                <ui-select-choices repeat="item.value as item in companyarr | filter: $select.search">
                                  <span ng-bind-html="item.label | highlight: $select.search"></span>
                                </ui-select-choices>
                             </ui-select>
						</div>
					</div>
					<div class="row mt10 ">
						
	 				   <div class="col-xs-3 ">
							 <ui-select ng-model="searchform.ticket_type" theme="bootstrap" ng-keyup="myKeyup($event)">
                                <ui-select-match placeholder="票类型">
                                  {{$select.selected.label}}
                                </ui-select-match>
                                <ui-select-choices repeat="item.value as item in tarr | filter: $select.search">
                                  <span ng-bind-html="item.label | highlight: $select.search"></span>
                                </ui-select-choices>
                             </ui-select>
						</div>
						<!-- <div class="col-xs-3 ">
							<ui-select ng-model="searchform.company_type" theme="bootstrap" ng-keyup="myKeyup($event)">
                                <ui-select-match placeholder="统计类型">
                                  {{$select.selected.label}}
                                </ui-select-match>
                                <ui-select-choices repeat="item.value as item in companyarr | filter: $select.search">
                                  <span ng-bind-html="item.label | highlight: $select.search"></span>
                                </ui-select-choices>
                             </ui-select>
						</div> -->
						<div class="col-xs-3 pull-right">
							 <input type="button " class="btn btn-info search form-control"  ng-click="orderSearch()" value="立即搜索">
						</div>
						<div class="col-xs-3 pull-right">
                           <input type="button " class="btn btn-info search form-control"  ng-click="exportToExcel('#Excel_table')" value="导出Excel">
						   <a id="dlink" download="{{selectedCompany}}{{ExcelName}}.xls" ng-show="false"></a>
						</div>

					</div>
				</div>
			</div>
		</div>

		<div class="col-xs-12  pre-scrollable" ng-if="item.list.length" ng-repeat="item in objs">
			{{item.name}}({{item.code}})
			<table class="table table-hover table-bordered" ng-if="ticket_type_flag == 1" content="text/html; charset=utf-8">
				<thead>
					<tr>
						<th class="col-md-2 text-center">机构编码</th>
						<th class="col-md-2 text-center">机构名称</th>
						<th class="col-md-2 text-center">产品编码</th>
						<th class="col-md-3 text-center">产品名称</th>
						<th class="col-md-1 text-center" style="padding-left:0px;padding-right: 0px;">购买数量</th>
						<th class="col-md-1 text-center" style="padding-left:0px;padding-right: 0px;">使用数量</th>
						<th class="col-md-1 text-center" style="padding-left:0px;padding-right: 0px;">退票数量</th>
					</tr>
				</thead>
				<tbody>
					<tr ng-repeat="obj in item.list">
						<td class="text-center">{{obj.company_code}}</td>
						<td class="text-center">{{obj.company_name}}</td>
						<td class="text-center">{{obj.sale_code}}</td>
						<td class="text-center">{{obj.sale_name}}</td>
						<td class="text-center">{{obj.buy}}</td>
						<td class="text-center">{{obj.used}}</td>
						<td class="text-center">{{obj.back}}</td>
					</tr>
				</tbody>
			</table>
			<table class="table table-hover table-bordered" ng-if="ticket_type_flag == 2" content="text/html; charset=utf-8">
				<thead>
					<tr>
						<th class="col-md-1 text-center">机构编码</th>
						<th class="col-md-2 text-center">机构名称</th>
						<th class="col-md-2 text-center">产品编码</th>
						<th class="col-md-2 text-center">产品名称</th>
						<th class="col-md-1 text-center" style="padding-left:0px;padding-right: 0px;">计划人数</th>
						<th class="col-md-1 text-center" style="padding-left:0px;padding-right: 0px;">预订人数</th>
						<th class="col-md-1 text-center" style="padding-left:0px;padding-right: 0px;">实际人数</th>
						<th class="col-md-1 text-center" style="padding-left:0px;padding-right: 0px;">名单人数</th>
						<th class="col-md-1 text-center" style="padding-left:0px;padding-right: 0px;">支付金额</th>
					</tr>
				</thead>
				<tbody>
					<tr ng-repeat="obj in item.list">
						<td class="text-center">{{obj.company_code}}</td>
						<td class="text-center">{{obj.company_name}}</td>
						<td class="text-center">{{obj.sale_code}}</td>
						<td class="text-center">{{obj.sale_name}}</td>
						<td class="text-center">{{obj.plan_count}}</td>
						<td class="text-center">{{obj.book_count}}</td>
						<td class="text-center">{{obj.actual_count}}</td>
						<td class="text-center">{{obj.count}}</td>
						<td class="text-center">{{obj.pay_price}}</td>
					</tr>
				</tbody>
			</table>
		</div>

		<!--导出Excel用的表格-->
		<table ng-show="false" id="Excel_table" content="text/html; charset=utf-8">
			<thead>
				<tr>
					<th class="col-md-2 text-center">机构编码</th>
					<th class="col-md-2 text-center">机构名称</th>
					<th class="col-md-2 text-center">产品编码</th>
					<th class="col-md-3 text-center">产品名称</th>
					<th class="col-md-1 text-center" ng-if="ticket_type_flag == 1">购买数量</th>
					<th class="col-md-1 text-center" ng-if="ticket_type_flag == 1">使用数量</th>
					<th class="col-md-1 text-center" ng-if="ticket_type_flag == 1">退票数量</th>
					<th class="col-md-1 text-center" ng-if="ticket_type_flag == 2">计划人数</th>
					<th class="col-md-1 text-center" ng-if="ticket_type_flag == 2">预订人数</th>
					<th class="col-md-1 text-center" ng-if="ticket_type_flag == 2">实际人数</th>
					<th class="col-md-1 text-center" ng-if="ticket_type_flag == 2">名单人数</th>
					<th class="col-md-1 text-center" ng-if="ticket_type_flag == 2">支付金额</th>
				</tr>
			</thead>
			<tbody ng-repeat="item in objs">
				<tr ng-repeat="obj in item.list">
					<td class="text-center">{{obj.company_code}}</td>
					<td class="text-center">{{obj.company_name}}</td>
					<td class="text-center">&nbsp;{{obj.sale_code}}</td>
					<td class="text-center">{{obj.sale_name}}</td>
					<td class="text-center" ng-if="ticket_type_flag == 1">{{obj.buy}}</td>
					<td class="text-center" ng-if="ticket_type_flag == 1">{{obj.used}}</td>
					<td class="text-center" ng-if="ticket_type_flag == 1">{{obj.back}}</td>
					<td class="text-center" ng-if="ticket_type_flag == 2">{{obj.plan_count}}</td>
					<td class="text-center" ng-if="ticket_type_flag == 2">{{obj.book_count}}</td>
					<td class="text-center" ng-if="ticket_type_flag == 2">{{obj.actual_count}}</td>
					<td class="text-center" ng-if="ticket_type_flag == 2">{{obj.count}}</td>
					<td class="text-center" ng-if="ticket_type_flag == 2">{{obj.pay_price}}</td>
				</tr>
			</tbody>
		</table>
		<!--导出Excel用的表格-->



		<!--<div class="text-right">
			<uib-pagination total-items="bigTotalItems" ng-model="bigCurrentPage" max-size="maxSize" class="pagination-sm" boundary-links="true"
			 ng-change="load()" items-per-page="itemsPerPage" previous-text="上一页" next-text="下一页" first-text="首页" last-text="末页" rotate="false">
			</uib-pagination>
		</div>-->
	</div>
</div>
	</div>
</div>